Skip to content

[Refactor/#80] ControlBox 커스터마이징, WorkspaceSetting 삭제영역 구조 통일 - #82

Merged
jjjsun merged 2 commits into
developfrom
refactor/#80
Mar 5, 2026
Merged

[Refactor/#80] ControlBox 커스터마이징, WorkspaceSetting 삭제영역 구조 통일#82
jjjsun merged 2 commits into
developfrom
refactor/#80

Conversation

@jjjsun

@jjjsun jjjsun commented Mar 4, 2026

Copy link
Copy Markdown
Collaborator

🚨 관련 이슈

Closed #80

✨ 변경사항

  • 🐞 BugFix Something isn't working
  • 💻 CrossBrowsing Browser compatibility
  • 🌏 Deploy Deploy
  • 🎨 Design Markup & styling
  • 📃 Docs Documentation writing and editing (README.md, etc.)
  • ✨ Feature Feature
  • 🔨 Refactor Code refactoring
  • ⚙️ Setting Development environment setup
  • ✅ Test Test related (storybook, jest, etc.)

✏️ 작업 내용

  • WorkspaceSetting 삭제 섹션이 인라인 UI로 구현되어있어 공통 컴포넌트 구조로 리팩토링
  • 삭제 영역 UI에 맞게 ControlBox 컴포넌트를 커스터마이징 가능하도록 확장

😅 미완성 작업

N/A

📢 논의 사항 및 참고 사항

기존 WorkspaceSetting의 삭제 섹션 인라인 UI를 ControlBox 구조를 변경하여 공통 컴포넌트 재사용성과 일관성을 높였습니다

💬 리뷰어 가이드 (P-Rules)
P1: 필수 반영 (Critical) - 버그 가능성, 컨벤션 위반. 해결 전 머지 불가.
P2: 적극 권장 (Recommended) - 더 나은 대안 제시. 가급적 반영 권장.
P3: 제안 (Suggestion) - 아이디어 공유. 반영 여부는 드라이버 자율.
P4: 단순 확인/칭찬 (Nit) - 사소한 오타, 칭찬 등 피드백.

Summary by CodeRabbit

릴리스 노트

  • 리팩토링
    • 제어 박스(UI 컴포넌트)에 스타일·레이아웃 및 버튼 옵션(변형, 크기, 비활성화 등)과 추가 슬롯(선행 아이콘·버튼 대체 등)을 도입해 커스터마이제이션을 확대했습니다.
    • 작업 공간 설정의 삭제 섹션을 통합된 제어 박스로 재구성해 UI 일관성과 유지보수성을 향상시켰습니다.

@jjjsun
jjjsun requested review from Seojegyeong and YermIm March 4, 2026 14:32
@jjjsun jjjsun self-assigned this Mar 4, 2026
@jjjsun jjjsun added the 🔨 Refactor 코드 리팩토링 label Mar 4, 2026
@coderabbitai

coderabbitai Bot commented Mar 4, 2026

Copy link
Copy Markdown
📝 Walkthrough

Walkthrough

ControlBox 컴포넌트의 props를 9개 확장하여 유연성을 높였고, WorkspaceSetting의 삭제 섹션을 이 컴포넌트로 리팩토링하여 코드 재사용성과 일관성을 개선했습니다.

Changes

Cohort / File(s) Summary
ControlBox 컴포넌트 확대
src/components/common/controlbox/ControlBox.tsx
Props 9개 추가(containerClassName, titleClassName, descriptionClassName, buttonVariant, buttonSize, buttonClassName, buttonSlot, leadingSlot, contentClassName)하여 외부에서 레이아웃과 스타일을 더 세밀하게 제어할 수 있도록 확장. buttonSlot으로 Button 커스터마이징 지원.
WorkspaceSetting 리팩토링
src/pages/workspace/WorkspaceSetting.tsx
기존 인라인 삭제 섹션(빨간 배경 스타일)을 ControlBox 컴포넌트로 대체. leadingSlot에 아이콘 전달하며 deleteModal 오픈 로직 보존.

Estimated code review effort

🎯 3 (Moderate) | ⏱️ ~20 minutes

Possibly related PRs

Suggested reviewers

  • YermIm
  • Seojegyeong
🚥 Pre-merge checks | ✅ 4 | ❌ 1

❌ Failed checks (1 warning)

Check name Status Explanation Resolution
Docstring Coverage ⚠️ Warning Docstring coverage is 0.00% which is insufficient. The required threshold is 80.00%. Write docstrings for the functions missing them to satisfy the coverage threshold.
✅ Passed checks (4 passed)
Check name Status Explanation
Title check ✅ Passed PR 제목이 주요 변경사항(ControlBox 커스터마이징 및 WorkspaceSetting 삭제영역 구조 통일)을 명확하게 반영하고 있으며, 이슈 #80과도 연관성이 높습니다.
Linked Issues check ✅ Passed 코드 변경사항이 이슈 #80의 요구사항과 완벽히 일치합니다. ControlBox 컴포넌트 확장(새로운 props 추가)과 WorkspaceSetting에서의 적용이 모두 구현되었습니다.
Out of Scope Changes check ✅ Passed 모든 변경사항이 이슈 #80의 범위 내에서 진행되었습니다. ControlBox.tsx와 WorkspaceSetting.tsx 파일의 변경이 모두 삭제 영역 구조 통일 목표에 부합합니다.
Description check ✅ Passed PR 설명이 템플릿 요구사항을 대부분 충족합니다. 제목, 관련 이슈, 변경사항 체크, 작업 내용, 미완성 작업, 논의 사항 등이 모두 작성되었습니다.

✏️ Tip: You can configure your own custom pre-merge checks in the settings.

✨ Finishing Touches
  • 📝 Generate docstrings (stacked PR)
  • 📝 Generate docstrings (commit on current branch)
🧪 Generate unit tests (beta)
  • Create PR with unit tests
  • Post copyable unit tests in a comment
  • Commit unit tests in branch refactor/#80

Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

Comment @coderabbitai help to get the list of available commands and usage tips.

@github-actions

github-actions Bot commented Mar 4, 2026

Copy link
Copy Markdown

📚 Storybook 배포 완료

항목 링크
📖 Storybook https://69a147b60a56365d9e2185ef-cpzstvbexy.chromatic.com/
🔍 Chromatic https://www.chromatic.com/build?appId=69a147b60a56365d9e2185ef&number=31

@coderabbitai coderabbitai Bot left a comment

Copy link
Copy Markdown

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Actionable comments posted: 2

🤖 Prompt for all review comments with AI agents
Verify each finding against the current code and only fix it if needed.

Inline comments:
In `@src/components/common/controlbox/ControlBox.tsx`:
- Around line 32-33: The exposed prop buttonSize on ControlBox is being
overridden by a hardcoded height utility (!h-button-big) in the rendered class
list, so size changes have no effect; update the ControlBox render logic to
remove the fixed "!h-button-big" and instead apply height/size classes
conditionally based on the buttonSize prop (e.g., map "small"|"medium"|"large"
to the appropriate classes) so the prop actually controls the button height;
adjust any related classname generation where "!h-button-big" appears (and
similarly for the other occurrence) to reference the new size-to-class mapping
used by the component.

In `@src/pages/workspace/WorkspaceSetting.tsx`:
- Around line 216-229: The delete flow button (ControlBox with title "워크스페이스
삭제") is currently clickable during a save, which allows concurrent save+delete
requests; wire the same disabling condition used for save into this control by
passing the appropriate disabled/disabledButton prop (or the ControlBox's
equivalent) so the delete button is disabled whenever saving || deleting is
true; update the ControlBox usage that currently has
onButtonClick={openDeleteModal} to include the disable flag tied to the existing
saving and deleting state variables so the button cannot be activated during
saves or while deletion is in progress.

ℹ️ Review info
⚙️ Run configuration

Configuration used: Path: .coderabbit.yaml

Review profile: CHILL

Plan: Pro

Run ID: 381f5a7c-4732-42b4-8d79-f777f4f05711

📥 Commits

Reviewing files that changed from the base of the PR and between 9cf8ed5 and cebc116.

📒 Files selected for processing (2)
  • src/components/common/controlbox/ControlBox.tsx
  • src/pages/workspace/WorkspaceSetting.tsx

Comment thread src/components/common/controlbox/ControlBox.tsx
Comment thread src/pages/workspace/WorkspaceSetting.tsx
@github-actions

github-actions Bot commented Mar 4, 2026

Copy link
Copy Markdown

📚 Storybook 배포 완료

항목 링크
📖 Storybook https://69a147b60a56365d9e2185ef-tvvuuqtmkp.chromatic.com/
🔍 Chromatic https://www.chromatic.com/build?appId=69a147b60a56365d9e2185ef&number=32

@YermIm

YermIm commented Mar 4, 2026

Copy link
Copy Markdown
Collaborator

P4: 확인했습니다!

@jjjsun
jjjsun merged commit 2383f4f into develop Mar 5, 2026
3 checks passed
@jjjsun
jjjsun deleted the refactor/#80 branch March 5, 2026 02:24
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

🔨 Refactor 코드 리팩토링

Projects

None yet

Development

Successfully merging this pull request may close these issues.

♻️ [Refactor] WorkspaceSetting 삭제 섹션에서 ControlBox 컴포넌트 적용

3 participants